<!--
 * @Descripttion: 
 * @Author: zhanyi
 * @Date: 2021-10-20 16:41:39
 * @FilePath: \wczd-mobile\src\pages\my-info\myInfo.vue
-->
<template>
  <div class="myInfo">
    <div class="top_me">
      <div class="title">个人资料</div>
      <div class="info">
        <div class="user-name">{{user.nickName}}</div>
      </div>
    </div>
    <div class="evan-form">
      <div class="evan-form-acc">
        <image src="@/static/wczd/my.png" slot="image"></image>
        <div class="evan-form-acc2" @click="openPost">
          <div class="acc-left">
            <div class="company-name">{{ user.defaultDeptCompanyName || user.companyName }}</div>
            <div class="post">{{ user.postName }}</div>
          </div>
          <view class="uni-input">
            <div class="acc-right">切换</div>
          </view>
        </div>
      </div>
      <div class="evan-form-acc">
        <image src="@/static/wczd/phone.png" slot="image"></image>
        <div class="evan-form-acc2">
          <div>我的号码</div>
          <div>{{user.phonenumber}}</div>
        </div>
      </div>
      <div class="evan-form-acc" @click="_editPassword">
        <image src="@/static/wczd/edit.png" slot="image"></image>
        <div class="evan-form-acc2">
          <div>修改密码</div>
          <image class="image-more" src="@/static/wczd/more.png"></image>
        </div>
      </div>
      <div class="evan-form-acc" @click="_myMessage">
        <image src="@/static/wczd/email.png" slot="image"></image>
        <div class="evan-form-acc2">
          <div>我的消息</div>
          <image class="image-more" src="@/static/wczd/more.png"></image>
        </div>
      </div>
      <!-- <div class="evan-form-acc" @click="_myIntegral">
        <image src="@/static/wczd/edition.png" slot="image"></image>
        <div class="evan-form-acc2">
          <div>我的积分</div>
          <image class="image-more" src="@/static/wczd/more.png"></image>
        </div>
      </div> -->
      <div v-if="version" class="evan-form-acc">
        <image src="@/static/wczd/phone.png" slot="image"></image>
        <div class="evan-form-acc2">
          <div>当前版本</div>
          <div>{{version}}</div>
        </div>
      </div>
      <div class="evan-form-acc">
        <image src="@/static/wczd/edition.png" slot="image"></image>
        <div class="evan-form-acc2" @click="_myIntegral">
          <div>安全币</div>
          <div style="display:flex;align-items:center;vertical-align: top;">{{user.points}}
            <image class="image-more" src="@/static/wczd/more.png"></image>
          </div>
        </div>
      </div>
    </div>
    <div class="evan-form">
      <div class="evan-form-acc" @click="_loginOut">
        <image src="@/static/wczd/sign-out.png" slot="image"></image>
        <div class="evan-form-acc2">
          <div>退出登录</div>
          <image class="image-more" src="@/static/wczd/more.png"></image>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getUserProfile, selectUserListByPersonId } from "@/api/user";

export default {
  name: 'myInfo',
  data () {
    return {
      version: '',
      index: 0,
      loginUser: [],
      formData: {},
      user: {},
      baseUrl: process.uniEnv.baseUrl
    }
  },
  mounted () {
    this._getUserProfile()
    this.getVersion()
  },
  methods: {
    //获取版本号
    getVersion () {
      let _this = this
      try {
        plus.runtime.getProperty(plus.runtime.appid, function (widgetInfo) {
          _this.version = widgetInfo.version
        });
      }
      catch (e) { }
    },
    // 切换账号
    changeUser () {
      selectUserListByPersonId({ personId: this.user.personId }).then(res => {
        this.loginUser = []
        for (let i = 0; i < res.rows.length; i++) {
          if (res.rows[i].userId === this.user.userId) {
            res.rows[i].clickState = '1'
            res.rows[i].text = res.rows[i].companyName + ' ' + res.rows[i].postName
            this.loginUser.push(res.rows[i])
          }
        }
        for (let i = 0; i < res.rows.length; i++) {
          if (res.rows[i].userId !== this.user.userId) {
            res.rows[i].clickState = '0'
            res.rows[i].text = res.rows[i].companyName + ' ' + res.rows[i].postName
            this.loginUser.push(res.rows[i])
          }
        }
      })
    },
    // 查询登录人员信息
    _getUserProfile () {
      getUserProfile().then(res => {
        this.user = res.data
        this.changeUser()
      })
    },
    // 我的积分
    _myIntegral () {
      uni.navigateTo({
        url: '/pages/integral/record'
      })
    },
    // 我的信息
    _myMessage () {
      uni.navigateTo({
        url: '/pages/my-info/my-message'
      })
    },
    // 更新密码
    _editPassword () {
      uni.navigateTo({
        url: '/pages/my-info/edit-password'
      })
    },
    openPost () {
      uni.navigateTo({
        url: '/pages/my-info/myPost',
      })
    },
    // 登录退出
    _loginOut () {
      uni.showModal({
        content: "确认是否退出！",
        confirmText: "确定",
        cancelText: "取消",
        success: res => {
          if (res.confirm) {
            this.$store.dispatch('LogOut').then(() => {
              uni.reLaunch({
                url: '/pages/login/login'
              })
            })
          } else if (res.cancel) {
            console.log('用户点击取消');
          }
        }
      })
    }
  },
}
</script>

<style scoped lang="scss">
.top_me {
  width: 100%;
  height: 200upx;
  background: url("@/static/wczd/login-bk.png") no-repeat;
  background-size: 100% 100%;
  position: relative;
  .title {
    padding-top: 20upx;
    font-size: 45upx;
    font-weight: bold;
    padding-left: 40upx;
    position: absolute;
  }
  .info {
    position: absolute;
    bottom: 40upx;
    left: 40upx;
  }
  .head {
    position: absolute;
    right: 40upx;
    top: 100upx;
    width: 200upx;
    height: 200upx;
    border: 8upx solid #ffffff;
    border-radius: 50%;
    overflow: hidden;
    image {
      width: 200upx;
      height: 200upx;
    }
  }
}

.user-name {
  font-size: 30upx;
  font-weight: bold;
  margin-right: 30upx;
}
.evan-form-acc {
  padding-top: 10upx;
  padding-bottom: 10upx;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1upx solid #f1f1f1;
  min-height: 90upx;
  image {
    width: 50upx;
    height: 50upx;
    margin-right: 20upx;
  }
  .image-more {
    margin: 0;
    transform: none;
  }

  .acc-right {
    padding: 5upx 10px;
    height: 100%;
  }

  .evan-form-acc2 {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}
</style>
